﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Snap.me</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    @Styles.Render("~/Content/bootstrap.min.css")
    <style type="text/css">
        body {
            padding-top: 20px;
            padding-bottom: 40px;
        }

        /* Custom container */
        .container-narrow {
            margin: 0 auto;
            max-width: 700px;
        }

            .container-narrow > hr {
                margin: 30px 0;
            }

        /* Main marketing message and sign up button */
        .jumbotron {
            margin: 60px 0;
            text-align: center;
        }

            .jumbotron h1 {
                font-size: 72px;
                line-height: 1;
            }

            .jumbotron .btn {
                font-size: 21px;
                padding: 14px 24px;
            }

        /* Supporting marketing content */
        .marketing {
            margin: 60px 0;
        }

            .marketing p + h4 {
                margin-top: 28px;
            }
    </style>
    @Styles.Render("~/Content/overideBootstrap.css")
    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

</head>

<body>

    <div class="container-narrow">
        <div class="masthead">
            <ul class="nav nav-pills pull-right">
                @Html.Partial("_LoginPartial")
            </ul>
            <h3 class="muted">@Html.ActionLink("Snap.me", "Index", "Home")</h3>
        </div>
    </div>
    @RenderSection("featured", required: false)
    <div class="container-narrow">
        <div class="row-fluid marketing">

            <div class="span6">
                @RenderBody()
            </div>

            <div class="span6">
                @RenderSection("right", required:false)
            </div>
        </div>

        <hr>

        <div class="footer">
            <p></p>
        </div>

    </div>
    <!-- /container -->
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/Scripts/bootstrap.min.js")
    @RenderSection("scripts", required: false)
    <script>$(function () {
    $(".media a.snapMessage").popover({ placement: 'right', html: true, content:"<form class='form-inline'><textarea rows='2'></textarea><a style='float:right;' href='#'>Send</a></form>"});
});  </script>
</body>
</html>
